<style>
  #box1 {
    height: 100px;
    width: 100px;
    background: green;
    transition: background 2s ease, transform 2s ease-in 1s;
  }

  #box2 {
    transform: rotate(180deg) scale(.5, .5);
    background: red;
  }
</style>

<body>
<div id="box1">BOX1</div>
</body>
